<template>
  <div class="body-box">
    <el-row>
      <el-col :span="11" :offset=" index%2 ? 2:0" v-for="(item, index) in needsData" :key="index">
        <el-card shadow="always" style="margin-top:20px">
          <el-form :model="item" label-width="80px">
            <el-form-item label="需求类型">
              <el-tag
                size="mini"
                style="margin-right:10px"
                type="danger"
                v-for="(items,key) in item.type"
                :key="key"
              >{{items}}</el-tag>
            </el-form-item>
            <el-form-item label="内容">
              <span>{{item.content}}</span>
            </el-form-item>
            <el-row>
              <el-col :span="10">
                <el-form-item label="联系电话">
                  <span>{{item.phone}}</span>
                </el-form-item>
              </el-col>
               <el-col :span="4" :offset="4">
                <el-form-item >
                   <el-tag v-if="item.state == 1" type="success" size="mini">已处理</el-tag>
                  <el-tag v-else-if="2" type="danger" size="mini">未处理</el-tag>
                  <el-tag v-else type="warning" size="mini">处理中</el-tag>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </el-card>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  props: { active_id: {} },
  data() {
    return {
      needsData: [
        {
          type: ["衣服定制", "号码簿制作"],
          content: "附件为普及物品价格",
          phone: "1660247885",
          state:1,
        },
        {
          type: ["衣服定制", "号码簿制作"],
          content: "附件为普及物品价格",
          phone: "1660247885",
          state:1,
        },
        {
          type: ["衣服定制", "号码簿制作"],
          content: "附件为普及物品价格",
          phone: "1660247885",
          state:1,
        }
      ]
    };
  },
  mounted() {
    this.getData();
  },
  methods: {}
};
</script>

<style scoped>
.el-form .el-form-item /deep/ .el-form-item__label {
  font-size: 16px;
  font-weight: bold;
  color: #333333;
}
.el-form .el-form-item {
  margin-bottom: 10px;
}
</style>